﻿@using PermissionsManager.Model;
@using PermissionManager.Model;
@{
    Layout = null;
    var modulelist = ViewBag.moduleList as List<Module>;
}

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="renderer" content="webkit|ie-comp|ie-stand" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link href="~/assets/css/bootstrap.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="~/css/style.css" />
    <link href="~/assets/css/codemirror.css" rel="stylesheet" />
    <link rel="stylesheet" href="~/assets/css/ace.min.css" />
    <link rel="stylesheet" href="~/font/css/font-awesome.min.css" />
    <link rel="stylesheet" href="~/layui/css/layui.mobile.css" />
    <link rel="stylesheet" href="~/layui/css/layui.css" />
    <link href="~/css/LayuiCheckbox.css" rel="stylesheet" />
    <script src="~/layui/layui.js"></script>
    <script src="~/js/jquery-1.9.1.min.js"></script>
    <script src="~/assets/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="~/Widget/Validform/5.3.2/Validform.min.js"></script>
    <script src="~/assets/js/typeahead-bs2.min.js"></script>
    <script src="~/assets/js/jquery.dataTables.min.js"></script>
    <script src="~/assets/js/jquery.dataTables.bootstrap.js"></script>
    <script src="~/assets/layer/layer.js" type="text/javascript"></script>
    <script src="~/js/lrtk.js" type="text/javascript"></script>
    <script src="~/assets/layer/layer.js" type="text/javascript"></script>
    <script src="~/assets/laydate/laydate.js" type="text/javascript"></script>
    <script src="~/Scripts/TimeFormat.js"></script>
    <title>管理员</title>
</head>

<body>
    <div class="page-content clearfix">
        <div class="administrator">
            <div class="d_Confirm_Order_style">
                <div class="search_style">

                    <ul class="search_content clearfix">
                        <li><label class="l_f">管理员名称</label><input name="" id="realName" type="text" class="text_add" placeholder="" style=" width:400px" /></li>
                        <li><label class="l_f">添加时间</label><input class="inline laydate-icon" id="start" style=" margin-left:10px;" /></li>
                        <li style="width:90px;"><button type="button" class="btn_search"><i class="fa fa-search"></i>查询</button></li>
                    </ul>
                </div>
                <!--操作-->
                <div class="border clearfix">
                    <span class="l_f">
                        <a href="javascript:ovid()" id="administrator_add" class="btn btn-warning"><i class="fa fa-plus"></i> 添加管理员</a>                        
                    </span>
                    <span class="r_f">共：<b>5</b>人</span>
                </div>
                <!--管理员列表-->
                <div class="clearfix administrator_style" id="administrator">
                    <div class="left_style">
                        <div id="scrollsidebar" class="left_Treeview">
                            <div class="show_btn" id="rightArrow"><span></span></div>
                            <div class="widget-box side_content">
                                <div class="side_title"><a title="隐藏" class="close_btn"><span></span></a></div>
                                <div class="side_list">
                                    <div class="widget-header header-color-green2"><h4 class="lighter smaller">管理员分类列表</h4></div>
                                    <div class="widget-body">
                                        <ul class="b_P_Sort_list">
                                            <li><i class="fa fa-users green"></i> <a href="#">全部管理员</a></li>
                                            <li><i class="fa fa-users orange"></i> <a href="#">超级管理员</a></li>
                                            <li><i class="fa fa-users orange"></i> <a href="#">管理员</a></li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="table_menu_list" id="testIframe">
                        <table class="layui-hide" id="sample_table" lay-filter="demo"></table>

                        <script type="text/html" id="barDemo">
                            <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
                            <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
                        </script>
                    </div>
                    <div class="layui-tab-item">
                        <div id="pageDemo"></div>
                    </div>
                </div>
            </div>
        </div>

        <!--添加管理员-->
        <div id="add_administrator_style" class="add_menber" style="display:none">
            <form action="" method="post" id="form-admin-add">
                <div class="form-group">
                    <label class="form-label"><span class="c-red">*</span>登录名：</label>
                    <div class="formControls">
                        <input type="text" class="input-text" value="" placeholder="" id="name" name="Name" datatype="*2-16" nullmsg="用户名不能为空" />
                    </div>
                    <div class="col-4"> <span class="Validform_checktip"></span></div>
                </div>
                <div class="form-group">
                    <label class="form-label"><span class="c-red">*</span>初始密码：</label>
                    <div class="formControls">
                        <input type="password" placeholder="密码" name="Password" id="password" autocomplete="off" value="" class="input-text" datatype="*6-20" nullmsg="密码不能为空" />
                    </div>
                    <div class="col-4"> <span class="Validform_checktip"></span></div>
                </div>
                <div class="form-group">
                    <label class="form-label "><span class="c-red">*</span>确认密码：</label>
                    <div class="formControls ">
                        <input type="password" placeholder="确认新密码" name="password1" id="Password1" autocomplete="off" class="input-text Validform_error" errormsg="您两次输入的新密码不一致！" datatype="*" recheck="userpassword" />
                    </div>
                    <div class="col-4"> <span class="Validform_checktip"></span></div>
                </div>
                <div class="form-group">
                    <label class="form-label "><span class="c-red">*</span>昵称：</label>
                    <div class="formControls ">
                        <input type="text" class="input-text" value="" placeholder="" id="employeeName" name="EmployeeName" datatype="m" />
                    </div>
                    <div class="col-4"> <span class="Validform_checktip"></span></div>
                </div>

                <div class="form-group">
                    <label class="form-label"><span class="c-red">*</span>邮箱：</label>
                    <div class="formControls ">
                        <input type="text" class="input-text" placeholder="" name="Email" id="email" datatype="e" nullmsg="请输入邮箱！" />
                    </div>
                    <div class="col-4"> <span class="Validform_checktip"></span></div>
                </div>
                <div class="form-group">
                    <label class="form-label">组：</label>
                    <div class="formControls ">
                        <span class="select-box" style="width:150px;">
                            <select class="select" id="moduleId" name="ModuleId" size="1">
                                @foreach (var item in modulelist)
                                {
                                    <option value=@item.Id>@item.Name</option>
                                }
                            </select>
                        </span>
                    </div>
                </div>
                <div class="form-group">
                    <label class="form-label">角色：</label>
                    <div class="formControls ">
                        <span class="select-box" style="width:150px;">
                            <select id="roleId" class="select" name="RoleId" size="1">
                            </select>
                        </span>
                    </div>
                </div>
                <div class="form-group">
                    <label class="form-label">备注：</label>
                    <div class="formControls">
                        <textarea cols="" rows="" id="remark" name="Remark" class="textarea" placeholder="说点什么...100个字符以内" dragonfly="true" onkeyup="checkLength(this);"></textarea>
                        <span class="wordage">剩余字数：<span id="sy" style="color:Red;">100</span>字</span>
                    </div>
                    <div class="col-4"> </div>
                </div>
                <div>
                    <input class="btn btn-primary radius" type="submit" id="btn_add" value="&nbsp;&nbsp;提交&nbsp;&nbsp;" />
                </div>
                <div style="display:none" id="Update">
                    <input class="btn btn-primary radius" type="submit" id="UpdateSub" value="&nbsp;&nbsp;修改&nbsp;&nbsp;" />
                </div>
            </form>
            <input type="hidden" id="adminid" name="name" value="" />
        </div>
    </div>
</body>
</html>
<script type="text/javascript">
    $(function () {

        $("#administrator").fix({
            float: 'left',
            skin: 'green',
            durationTime: false,
            spacingw: 50,//设置隐藏时的距离
            spacingh: 270,//设置显示时间距
        });
    });
    //字数限制
    function checkLength(which) {
        var maxChars = 100; //
        if (which.value.length > maxChars) {
            layer.open({
                icon: 2,
                title: '提示框',
                content: '您输入的字数超过限制!',
            });
            // 超过限制的字数了就将 文本框中的内容按规定的字数 截取
            which.value = which.value.substring(0, maxChars);
            return false;
        } else {
            var curr = maxChars - which.value.length; //250 减去 当前输入的
            document.getElementById("sy").innerHTML = curr.toString();
            return true;
        }
    };
    //初始化宽度、高度
    $(".widget-box").height($(window).height() - 215);
    $(".table_menu_list").width($(window).width() - 260);
    $(".table_menu_list").height($(window).height() - 215);
    //当文档窗口发生改变时 触发
    $(window).resize(function () {
        $(".widget-box").height($(window).height() - 215);
        $(".table_menu_list").width($(window).width() - 260);
        $(".table_menu_list").height($(window).height() - 215);
    });
    //日期框加载
    laydate({
        elem: '#start',
        event: 'focus'
    });

    //组下拉框改变,获得其对应的角色
    $("#moduleId").change(function () {
        $.ajax({
            type: "post",
            url: "/Admin/GetRoleByModule",
            data: {ModuleId : $(this).val()},
            async: false,
            success: function (data) {
                $("#roleId").html("");
                for (var i in data.data) {
                    var role = data.data[i];
                var html = "<option value="+role.Id+">"+role.Name+"</option>";
                $("#roleId").append(html);
                }
             }
          })
    })


    /*添加管理员*/
    $('#administrator_add').on('click', function () {
        //$("#btn_add").show();
        //$("#Update").hide();
        layer.open({
            type: 1,
            title: '添加管理员',
            area: ['700px', ''],
            shadeClose: false,
            content: $('#add_administrator_style'),
        });
    });

    /*提交按钮*/
    $("#btn_add").on("click", function () {
        var data = {};
        data.Name = $("#name").val();
        data.Password = $("#password").val();
        data.EmployeeName = $("#employeeName").val();
        data.Email = $("#email").val();
        data.Remark = $("#remark").val();
        var ModuleId = $("[name='ModuleId']").val();
        var RoleId = $("#roleId").val();


        $.ajax({
            type: "post",
            url: "/Admin/AddAdmin?moduleId=" + ModuleId + "&roleId=" + RoleId,
            data: data,
            async: false,
            success: function (data) {
                if (data.Success) {
                    layer.msg('添加成功...', {
                        title: '提示框',
                        icon: 1,
                        time: 1000
                    })
                } else {
                    layer.alert('添加失败！', {
                        title: '提示框',
                        icon: 1,
                    });
                }
            }
        });
    });


    $("#UpdateSub").click(function () {
        var flag = false;
        $("#add_administrator_style input").each(function () {
            if ($(this).val() == "") {             
                flag = true;
                return false;
            }            
        });
        if (flag) {            
            alert("请输入值");
            return false;
        } else {
            var dada = {};
            dada.Id = $("#adminid").val();

            dada.moduleId = $("#moduleId").val();
            dada.Name = $("#name").val();
            //data.ModuleId = $("#moduleId").val();
            dada.Password = $("#password").val();
            dada.EmployeeName = $("#employeeName").val();
            dada.email = $("#email").val();
            dada.Remark = $("#remark").val();
            dada.RoleId = $("#roleId").val();
            $.ajax({
                type: "post",
                data: dada,
                url: "/Admin/UpdateAdmin",
                success: function (data) {
                    if (data.Success) {
                        layer.msg('修改成功');

                    } else {
                        layer.alert('修改失败！', {
                            title: '提示框',
                            icon: 1,
                        });
                    }
                }
            });
        }
    })





      //条件查询按钮
    $(".btn_search").click(function () {
        var table = layui.table;
        var adminLoginName = $("#realName").val();
        var data1 = $("#start").val();
        table.reload('sample_table', {
            where:{
                Name : adminLoginName,
                CreateTime : data1
            }
        });
    });

    $(function () {
        layui.use(['table', 'util'], function () {
            //用table就要定义
            var table = layui.table;
            //用form就要定义
            var form = layui.form;

            //表格加载
            table.render({
                elem: '#sample_table'
                , height: 500
                , url: '/Admin/QueryPageList' //数据接口
                , page: true //开启分页
                , cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
                , cols: [[ //表头
                 
                     { field: 'AdminId', title: '管理员Id', sort: true, }
                    , { field: 'ModuleId', title: 'Id', sort: true,hide: true  }
                    , { field: 'ModuleName', title: '组名', sort: true }
                    , { field: 'Name', title: '名字', sort: true }
                    , { field: 'Password', title: '密码', sort: true, hide: true }
                    , { field: 'EmployeeName', title: '昵称' }
                    , { field: 'Remark', title: '备注',width: 80, sort: true }
                    , { field: 'Email', title: 'Email', sort: true }
                    , { field: 'CreateTime', title: '创建时间', width: 120, sort: true, templet: '<div>{{ Format(d.CreateTime,"yyyy-MM-dd hh:mm:ss")}}</div>' }
                    , { title: '操作', fixed: 'right', width: 200, align: 'center', toolbar: '#barDemo' }
                ]]
            });

            //监听表格复选框选择
            table.on('checkbox(test)', function (obj) {


                $("#deleteBatch").click(function () {
                    alert("进入");
                    var checkStatus = table.checkStatus('demo')
                        , data = checkStatus.data;
                    if (checkStatus.data.length === 0) {
                        return layer.msg('请选择数据');
                    }
                    var adminid = "";
                    for (var i = 0; i < checkStatus.data.length; i++) {
                        adminid += checkStatus.data[i].AdminUserId + ",";
                    }
                    layer.confirm('确定删除吗?', function (index) {
                        $.ajax({
                            type: 'POST',
                            url: "/Admin/BatchDelete?AdminId=" + adminid,
                            success: function (json) {
                                if (json.Success) {
                                    obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
                                    layer.alert('删除成功...', {
                                        title: '提示框',
                                        icon: 1,
                                    })

                                } else {
                                    layer.alert('删除失败...', {
                                        title: '提示框',
                                        icon: 1,
                                    })
                                }
                            }
                        })
                    });
                });
            });

            //监听工具条
            table.on('tool(demo)', function (obj) {
                var data = obj.data //获得当前行数据
                var id = data.AdminId;
                var moduleId = data.ModuleId;

                if (obj.event === 'del') {
                    //删除的功能代码
                    layer.confirm('真的要删除吗', function (index) {
                        $.ajax({
                            url: "/Admin/DeleteAdmin?id=" + id + "&moduleId=" + moduleId,
                            type: "Post",
                            success: function (data) {
                                if (data.Success) {
                                    layer.msg('删除成功...', {
                                        title: '提示框',
                                        icon: 1,
                                        time: 1000
                                    }, function () {
                                        TableReload();
                                        layer.close(index);
                                    });
                                }
                                else {
                                    layer.msg('删除失败...', {
                                        title: '提示框',
                                        icon: 1,
                                        time: 1000
                                    });
                                }
                            }
                        });
                    });
                } else if (obj.event === 'edit') {
                    //赋值隐藏域id
                    $("#adminid").val(data.AdminId);
                    //显示页面信息
                    ShowHtmlInfo(data);
                    layer.open({
                        type: 1,
                        title: '编辑管理员',
                        area: ['700px', ''],
                        shadeClose: false,
                        content: $('#add_administrator_style'),
                        end: function () {
                            //重置表单
                            Reset();
                        }
                    });
                    $("#btn_add").hide();
                    $("#Update").show();
                }
            });
        });


        //显示页面信息
        function ShowHtmlInfo(data) {
            $("#name").val(data.Name);
            $("#password").val(data.Password);
            $("#Password1").val(data.Password);
            $("#employeeName").val(data.EmployeeName);
            $("#email").val(data.Email);
            $("#remark").val(data.Remark);
        }

        //移除禁用页面信息
        function RemoveDisableHtmlInfo() {
            $('input,select,textarea', $('form[id="form-admin-add"]')).removeAttr('readonly');
        }

        //禁用页面信息
        function DisableHtmlInfo() {
            $('input,select,textarea', $('form[id="form-admin-add"]')).attr('readonly', true);
        }

        //清空表单的值
        function Reset() {
            document.getElementById("form-admin-add").reset();
        }

        //列表刷新
        function TableReload() {
            var table = layui.table;
            var adminLoginName = $("#realName").val();
            var data1 = $("#start").val();
            //上述方法等价于
            table.reload('sample_table', {
                where: { //设定异步数据接口的额外参数，任意设

                }
            });
        }

        //点击管理员分类列表触发右边列表数据展示
        $(".orange").next().click(function () {
            var roleid = $(this).attr("role");
        });
    });
</script>

